<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="vue.js"></script>
    <script src="jquery/jquery-1.9.1.min.js"></script>
</head>
<body>
<div id="app">
    <p>服务地址 如 http://localhost:1001</p>
    <input v-model="cfg.Host">
    <p>文档地址</p>
    <div>
        <input v-model="cfg.Doc">
    </div>
    <p>前缀</p>
    <div v-for="(p,i) in cfg.Prefixs">
        <input v-model="cfg.Prefixs[i]">
    </div>
    <button v-on:click="add">添加一行</button>
    <button v-on:click="del">删除一行</button>
    <br>
    <button v-on:click="submit">提交</button>
</div>

<script>
    var g_cfg={
        Prefixs:[],
        Host:""
    }
    var g_app = new Vue({
        "el":"#app",
        "methods":{
            add(){

                  this.cfg.Prefixs.push("")
            },
            del(){
                this.cfg.Prefixs.pop()
            },
            submit(){
                $.ajax({
                    type: "POST",
                    url: "/s_setconfig",
                    contentType: "application/json; charset=utf-8",
                    data: JSON.stringify(g_app.$data.cfg),
                    dataType: "json",
                    success: function () {
                        $.post("/s_getconfig",resp=>{
                            g_app.cfg = resp
                        })

                    },
                    error: function (e) {
                        $.post("/s_getconfig",resp=>{
                            g_app.cfg = resp
                        })
                    }

                })

            }
        },
        "data":{
            cfg:{
                Prefixs:[],
                Host:""
            },
        }
    })
    $.post("/s_getconfig",resp=>{
        g_app.cfg = resp
    })
</script>
</body>
</html>